<!DOCTYPE html>
<html lang="zh-CN"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>评价</title>
    <meta name="keywords" content="评价" />
    <meta name="description" content="评价" />
    <meta name="viewport" content="width=device-width,initial-scale=1, maximum-scale=1,minimum-scale=1, user-scalable=no">
    <meta http-equiv="Conorder_content-Type" content="text/html; charset=utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="width=device-width,viewport-fit=cover">
    <link th:href="@{/shoppingApi/css/public.css}" rel="stylesheet">
    <link th:href="@{/shoppingApi/css/weui.min.css}" rel="stylesheet">
    <link th:href="@{/shoppingApi/css/jquery-weui.min.css}" rel="stylesheet">
    <link th:href="@{/shoppingApi/css/order.css}" rel="stylesheet">
    <meta name="_csrf" th:content="${_csrf.token}"/>
    <meta name="_csrf_header"  th:content="${_csrf.headerName}"/>
    <style>
        .goodlist li {
            padding-bottom: 1px;
            background-color: #fff;
        }
        .order .goodlist li .shop {
            border-bottom: 1px solid #f0f0f0;
        }
        .order .goodlist .goodmess {
            padding: 0;
            margin: 15px;
            background-color: #f0f0f0;
        }
    </style>
</head>
<body>
<div class="main_new order">
    <div class="goback" style="text-align: center;padding: 10px; background-color: #f70029; color: #fff;">
        <h3>评价</h3>
    </div>
    <div class="main_con c323232">
        <ul id="orderList" class="goodlist mt10" style="margin-top: 10px;">
            <li th:each="modelS:${orderList.list}" id="orderLi" th:data="${modelS.orderNo}">
                <p th:each="model,numis:${modelS.orderDetailsProducts}" class="pl15 pr15 shop bgfff mt15" style="border:none;">
                    <img class="fl mt6"  th:src="${model.imgUrl}">
                    <span class="ft14 c323232 fl ml10" th:text="${model.productName}"></span>
                </p>
            </li>
        </ul>
        <div>
            <textarea class="comment-area mt5" id="comment" cols="30" rows="10" placeholder="分享你的购买心得"></textarea>
            <div class="pl15 pr15 pt10 pb10 mt5 bgfff" style="overflow: hidden;position: relative;">
                <label class="fl anonymous c646464" for="anonymous">匿名</label>
                <input type="checkbox" id="anonymous" style="display:none;">
                <button class="comment-submit ft15" id="submit">提交评价</button>
            </div>
        </div>

    </div>
</div>
</body>
<script th:src="@{/shoppingApi/js/jquery-3.3.1.min.js}"></script>
<script th:src="@{/shoppingApi/js/jquery-weui.min.js}"></script>
<script th:src="@{/shoppingApi/js/common.js}"></script>


<script type="text/javascript">
    var header = $("meta[name='_csrf_header']").attr("content");
    var token =$("meta[name='_csrf']").attr("content");
    $(function () {
        // 匿名选择
        $('.anonymous').click(function (e) {
            var _this = $(this);
            if (!_this.hasClass('active')) {
                _this.addClass('active');
            } else {
                _this.removeClass('active');
            }
        });

        // 提交评价
        $.toast.prototype.defaults.duration = 1000;
        $('#submit').click(function (e) {
            var content = $.trim($('#comment').val());
            var orderNo=$.trim($("#orderLi").attr("data"));
            if (!content) {
                $.toast('请输入评价内容~', 'text');
                return;
            }else {
                $.ajax({
                    url: '/wap/addOrderComment?orderNo='+orderNo+"&content="+content,
                    type: 'post',
                    dataType: 'json',
                    contentType: 'application/json',
                    async: false,
                    success: function(data){
                        if(data.data>0){
                            $.toast('评论成功~', 'text');
                        }else {
                            $.toast('评论失败~', 'text');
                        }
                    },
                    beforeSend : function(xhr) {
                        xhr.setRequestHeader(header, token);
                    }
                });
            }
        });
    })
</script>
</html>